
<form method="post"
	action="${rc.getContextPath()}/manage/workflowBusiness/saveBusinessField"
	class="pageForm required-validate">
	<div class="pageContent">
		<div class="pageFormContent" layoutH="50">
			<input type="hidden" name="navTabId" value=""> <input
				type="hidden" name="businessType" value="${businessType!''}">

			<fieldset class="dataset">
				<dl>
					<dt><@label key="businessField.C,colon">业务字段：</@label></dt>
					<dd>
						<input name="businessField" size="32" type="text" maxlength="30"
							class="required alphanumeric toUp" value="${businessField.businessField!''}"
						  readonly="true"  />
					</dd>
				</dl>
				<dl>
					<dt><@label key="fieldLabel.C,colon">字段标签：</@label></dt>
					<dd>
						<input name="fieldLabel" size="32" type="text" maxlength="30"
							class="required " value="${businessField.fieldLabel!''}" 
						/>
					</dd>
				</dl>
				<dl>
					<dt><@label key="dbField.C,colon">数据库字段：</@label></dt>
					<dd>
						<input name="dbField" size="32" type="text" maxlength="30"
							class="required toUp" value="${businessField.dbField!''}"
						readonly="true"  />
					</dd>
				</dl>
				<dl>
					<dt><@label key="fieldDescription.C,colon">字段描述：</@label></dt>
					<dd>
						<input name="fieldDescription" size="32" type="text"
							maxlength="255" 
						value="${businessField.fieldDescription!''}"  />
					</dd>
				</dl>
				<dl>
					<dt><@label key="DataType.C,colon">数据类型：</@label></dt>
					<dd>
						<input type='hidden' name='dataType' value=''> 
						<select name="dataType_select" disabled="disabled"> 
						 <#list businessFieldDataTypes as type>
								<option value="${type.dataType}"<#if
									(businessField.dataType)?? && businessField.dataType ==
									type.dataType> selected="selected"</#if>>${type.text}</option>
						</#list>
						</select>
					</dd>
				</dl>
				<dl>
					<dt><@label key="fieldType.C,colon">字段类型：</@label></dt>
					<dd>
						<select name="fieldType"> 
						</select>

					</dd>
				</dl>
				<dl>
					<dt><@label key="defaultValue.C,colon">默认值：</@label></dt>
					<dd>
						<input name="defaultValue" size="32" type="text" maxlength="255" value="${businessField.defaultValue!''}" 
						/>
					</dd>
				</dl>
				<dl>
					<dd>
						<label style="width: 150px;"><input type="checkbox"
							name="requiredFlag" value="1" <#if businessField.requiredFlag == 1> checked="true"</#if> /><@label
							key="requiredFlag.C">必填</@label></label>
					</dd>
				</dl>
				<dl>
					<dt><@label key="maximumValue.C,colon">最大值：</@label></dt>
					<dd>
						<input name="maximumValue" size="32" type="text" maxlength="255"
						 value="${businessField.maximumValue!''}" 
						/>
					</dd>
				</dl>
				<dl>
					<dt><@label key="minValue.C,colon">最小值：</@label></dt>
					<dd>
						<input name="minimumValue" size="32" type="text" maxlength="255" value="${businessField.minimumValue!''}" 
						/>
					</dd>
				</dl>
				<dl>
					<dt><@label key="length.C,colon">长度：</@label></dt>
					<dd>
						<input name="length" size="32" type="text" maxlength="4" class="number" value="${businessField.length!''}"  />
					</dd>
				</dl>
				<dl>
					<dt><@label key="scale.C,colon">小数位数：</@label></dt>
					<dd>
						<input name="scale" size="32" type="text" class="number" maxlength="4" value="${businessField.scale!''}" />
					</dd>
				</dl>
				<dl>
					<dt><@label key="validationExpression.C,colon">验证表达式：</@label></dt>
					<dd>
						<input name="validationExpression" size="32" type="text"
							maxlength="255" value="${businessField.validationExpression!''}"  />
					</dd>
				</dl>
				<dl>
					<dd>
						<label style="width: 150px;"><input type="checkbox"
							name="systemFieldFlag" value="1"<#if businessField.systemFieldFlag == 1> checked="true"</#if>
							disabled="disabled"><@label
							key="systemFieldFlag.C">系统字段</@label></label>
					</dd>
				</dl>
				<dl class="nowrap" style="display: none;"
					display-ref="DYNAMICOPTION">
					<dt><@label key="querySql.C,colon">选项值查询语句：</@label></dt>
					<dd>
						<textarea name="querySql" cols="70" maxlength="1000">${businessField.querySql!''}</textarea>
					</dd>
				</dl>
				<dl class="nowrap" display-ref="STATICOPTION">
					<dt><@label
						key="staticOptionsConfig.C,colon">静态选项值配置：</@label></dt>
					<dd style="width: 80%;">
						<div id="bar" class="panelBar">
							<ul class="toolBar">
								<li><a class="add" name="btnStaticOptionAdd"><span><@label
											key="add.B">新增</@label></span></a></li>
							</ul>
						</div>
						<table class="table border" width="100%" layoutH="350">
							<thead>
								<tr>
									<th width="100"><@label key="Enumeration.C">枚举值</@label></th>
									<th width="200"><@label
										key="EnumerationText.C">枚举值描述</@label></th>
									<th width="50"><@label key="opera.C">操作</@label></th>
								</tr>
							</thead>
							<tbody name="staticOptionTbody">
								<#if businessField?? && businessField.businessFieldValueList??>
								<#list businessField.businessFieldValueList as
								businessFieldValue>
								<tr rel="${businessFieldValue.value!''}">
									<td><input type="text" class="textInput required alphanumeric toUp"
										name="businessFieldValueList[${businessFieldValue_index}].value"
										value="${businessFieldValue.value!}" /></td>
									<td><input type="text" class="textInput" 
										name="businessFieldValueList[${businessFieldValue_index}].valueText"
										value="${businessFieldValue.valueText!}" /></td>
									<td><a title="<@label key="delete.B">删除</@label>"
											class="btnDel" name="btnStaticOptionDel"
											value="${businessFieldValue.value!}" ><@label
											key="delete.B">删除</@label></a></td>
								</tr>
								</#list> </#if>
							</tbody>
						</table>
		</div>
		</dd>
		</dl>

		</fieldset>
	</div>
	<div class="formBar">
		<ul>
			<li>
				<div class="buttonActive">
					<div class="buttonContent">
						<button type="button" name="btnSave"><@label
							key="save.B">保存</@label></button>
					</div>
				</div>
				<div class="buttonActiveGrey" style="margin-left: 10px;">
					<div class="buttonContent">
						<button type="button" class="close"><@label
							key="close.B">关闭</@label></button>
					</div>
				</div>
			</li>
		</ul>
	</div>
	</div>
</form>
<script type="text/javascript">
    (function($){
    	var businessFieldDataTypes = [
        <#list businessFieldDataTypes as businessFieldDataType>
    	{
    		   type : '${businessFieldDataType.dataType}',
    		   text : '${businessFieldDataType.text}',
    		   maxLength : '${businessFieldDataType.maxLength}',
    		   fieldTypes : [
    		      <#list businessFieldDataType.fileTypeList  as businessFieldTypeDef>   
    		      {
    		    	   type : '${businessFieldTypeDef.id}',
    		    	   text : '${businessFieldTypeDef.text}'
    		       }<#if businessFieldTypeDef_has_next>,</#if>
    	          </#list>
    	       ]
    	 }<#if businessFieldDataType_has_next>,</#if>
    	 </#list>
    	];
    	                              
    	var page = DWZ.context();
    	                              
    	 //根据数据类型动态切换字段类型
    	function dynamicShowFileldTypeByDataType(value){
    		   var fileTypeEl = $("select[name='fieldType']",page);
    		   fileTypeEl.html("");
    		   var fieldTypes = [];
    		   for(var i = 0; i< businessFieldDataTypes.length ; i++){
    			   if(businessFieldDataTypes[i]["type"] === value){
    				   fieldTypes = businessFieldDataTypes[i]["fieldTypes"];
    				   for(var j = 0 ; j< fieldTypes.length ; j++){
    					   fileTypeEl.append("<option value='"+fieldTypes[j]["type"]+"'>"+fieldTypes[j]["text"]+"</option>")
    				   }
    				   break;
    			    }
    		   }
    	}
        
        //动态调整页面组件显示，并调整弹窗大小
        function dynamicShowDlByDataType(value){
            var dialog = $.pdialog.getCurrent();
            if("STATICOPTION" === value  ){
                $.pdialog.resizeDialog({style: {left:dialog.css("left"),top:dialog.css("top"),height:500,width:dialog.css("width")}},$.pdialog.getCurrent(),"se");
                 $("dl[display-ref='STATICOPTION']",page).show();
                 $("dl[display-ref='DYNAMICOPTION']",page).hide();
            }else if("DYNAMICOPTION" === value){
                $.pdialog.resizeDialog({style: {left:dialog.css("left"),top:dialog.css("top"),height:370,width:dialog.css("width")}},$.pdialog.getCurrent(),"se");
                $("dl[display-ref='DYNAMICOPTION']",page).show();
                $("dl[display-ref='STATICOPTION']",page).hide();
            }else{
                $.pdialog.resizeDialog({style: {left:dialog.css("left"),top:dialog.css("top"),height:330,width:dialog.css("width")}},$.pdialog.getCurrent(),"se");
                $("dl[display-ref='DYNAMICOPTION']",page).hide();
                $("dl[display-ref='STATICOPTION']",page).hide();
            }
        }
       
        // 动态设置相关组件最大长度值
        function dynamicSetMaxLength(value){
            for(var i = 0; i< businessFieldDataTypes.length ; i++){
                if(businessFieldDataTypes[i]["type"] === value){
                    //找到对应类型字段配置
                    $("input[name='length']",page).attr("max",businessFieldDataTypes[i]["maxLength"]);
                    $("input[name='maximumValue']",page).attr("maxLength",businessFieldDataTypes[i]["maxLength"]);
                    $("input[name='minimumValue']",page).attr("maxLength",businessFieldDataTypes[i]["maxLength"]);
                    break;
                 }
            }
        }
        
	   $("input[name='dataType']",page).val($("select[name='dataType_select']",page).val());
	       
	   //初始化已经填充的数据最大长度
	   function initOptionMaxLength(){
		   for(var i = 0; i< businessFieldDataTypes.length ; i++){
               if(businessFieldDataTypes[i]["type"] === "STATICOPTION"){
                   $("input[type='text']",$("tbody[name='staticOptionTbody']",page)).attr("maxLength",businessFieldDataTypes[i]["maxLength"]);
                }else if(businessFieldDataTypes[i]["type"] === "DYNAMICOPTION"){
                    $("textarea[name='querySql']",page).attr("maxLength",businessFieldDataTypes[i]["maxLength"]);
                }
           }
		   
		   
		    
	   }
	   setTimeout(function(){
		   var value = $("input[name='dataType']",page).val();
		    dynamicShowDlByDataType(value);
		    dynamicShowFileldTypeByDataType(value);
		    dynamicSetMaxLength(value);
	       resetColumnWidth();
           initOptionMaxLength();
	       $("select[name='fieldType']",page).val('${businessField.fieldType}');
		}, 10);
      
        var staticOptionIndex = ${businessField.businessFieldValueList?size};
        
        //枚举类型操作--新增一行
        function insertNewRow(){
        	var maxLength = 255;
            for(var i = 0; i< businessFieldDataTypes.length ; i++){
                if(businessFieldDataTypes[i]["type"] === "STATICOPTION"){
                    //找到对应类型字段配置
                    maxLength = businessFieldDataTypes[i]["maxLength"];
                    break;
                 }
            }
        	var html = '<tr><td width="100"><input type="text" class="textInput required alphanumeric toUp"   maxlength="'+maxLength+'" name="businessFieldValueList['+staticOptionIndex+'].value" /></td><td width="200"><input type="text"  class="textInput"  maxlength="'+maxLength+'" name="businessFieldValueList['+staticOptionIndex+'].valueText" /></td><td width="50"><a title="<@label key="delete.B">删除</@label>" class="btnDel" name="btnStaticOptionDel"><@label key="delete.B">删除</@label></a></td></tr>'
            var tr = $("tbody[name='staticOptionTbody']",page).append(html);
            staticOptionIndex ++;
            resetColumnWidth();
        }
        
        //枚举类型操作--删除当前行
        function deleteRow(sourceEl){
        	var trEl = $(sourceEl).parents("tr:first");
            trEl.remove();
            resetColumnWidth();
        }
        
        function resetColumnWidth(){
        	//新增完成之后调整列宽
            $.jTableTool.initGridColumnWidth($(".grid",page));
            $.each($("input[type='text']",$(".grid",page)),function(){
                $(this).css("width",$(this).parent().width()*0.65);
            })
        }
        
       $("a[name='btnStaticOptionAdd']",page).on("click",function(){
    	   insertNewRow();
    	   //新增一行后绑定事件
    	   $("a[name='btnStaticOptionDel']:last",page).on("click",function(){
               deleteRow(this);
           });
       });
       
       $("a[name='btnStaticOptionDel']",page).on("click",function(){
    	   deleteRow(this);
       });
       
       $("button[name='btnSave']",page).on("click",function(){
    	   var dataType = $("select[name='dataType']",page).val() || $("input[name='dataType']",page).val();
    	   if("STATICOPTION" === dataType && 0 === $(".gridTbody tr ",page).length){
    		   alertMsg.error("<@label key='businessFieldStaticOptionNeed.C'>请添加枚举信息</@label>");
               return false;
    	   }
    	   
    	   validateCallback($("form",page),function(json){
    		   dialogAjaxDone(json);
    		   //关闭当前页面后重新加载上次弹窗页面
               $.pdialog.reload("${rc.getContextPath()}/manage/workflowBusiness/toEditBusinessType?navTabId=${navTabId!''}&businessType=${businessType!''}",{dialogId:'businessType'});
               
    	   });
       })
       
       //数据类型下拉联动显示相关组件
       $("select[name='dataType']",page).on("change",function(){
    	   var value=$(this).val();
           dynamicShowDlByDataType(value);
           dynamicShowFileldTypeByDataType(value);
           dynamicSetMaxLength(value)
       })
    })(jQuery);
    </script>